<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>撤销订单记录</title>

    <!--公用css引用-->
    @include('front.common.style')
    <!--END/公用css引用-->
    <link rel="stylesheet" href="../dist/css/userCenter.css">
</head>
<body>

<!--公共头部-->
@include('front.common.header')

<!--END/公共头部-->

<div class="inbox user-center">
    <div class="layout-margin unend">
        <div class="sidebar-end"></div>
        <div class="sidebar-start">
        @include('front.common.leftnav')

        </div>
@inject('pictureService','App\Interfaces\PictureService')
@inject('orderService','App\Interfaces\OrderService')
        <!--主体部分-->
        <div class="container">
            <div class="container-inner u-order fn-ohide">
            @if($orderService->countCancelOrders($user->id) != 0)
                <div class="ui-brd-box1">
                    <div class="tit-2 tit-skin-2 fn-mb20">
                        <span class="h">取消订单记录</span>
                    </div>
                    <div class="order-list order-list-big">
                        <table class="bl-table table-tc bl-table-tdLi">
                            <thead>
                            <tr>
                                <th>订单编号</th>
                                <th>订单商品</th>
                                <th>提交时间</th>
                                <th>支付明细</th>
                                {{--<th>退款状态</th>--}}
                                <th>操作</th>
                            </tr>
                            </thead>
                            <tbody>
                            @foreach($orderService->getCancelOrders($user->id,$page_size) as $key=>$cancelOrder)
                            <tr>
                                <td><span class="order-id">{{$cancelOrder->order_sn}}</span></td>
                                <td class="pic">
                                @foreach($orderService->getOrderGoods($cancelOrder->order_id) as $key=>$orderGoods)
                                    <a href="/goods/{{$orderGoods->goods_id}}" target="_blank" title="{{$orderGoods->goods_name}}">
                                        <img class="head-img" src="{{$pictureService::thumb($orderGoods->goods_thumb, 70, 70)}}" alt="#">
                                    </a>
                                @endforeach
                                </td>

                                <td>
                                    <span>{{$cancelOrder->cancel_time}}</span>
                                </td>
                                <td>
                                    <span>订单金额：￥{{$cancelOrder->order_price+$cancelOrder->order_tariff_fee+$cancelOrder->shipping_fee}}</span><br>

                                </td>

                                <td>
                                    <a href="/my/order/{{$cancelOrder->order_id}}" target="_blank" class="text-color-0">查看</a>
                                </td>
                            </tr>
                            @endforeach
                            </tbody>
                        </table>
                    </div>
                </div>


                <!--分页-->
                <!--  fn-tl/fn-tc/fn-tr 左中右定位; pager-big 大尺寸分页 可不加-->
                <div class="pager fn-tr">
                    <ul class="pagination">
                    {!! $orderService->getCancelOrders($user->id)->render() !!}
                    </ul>
                </div>
                <!--END/分页-->
                @else
                <!--无数据-->
                <div class="ui-brd-box1">
                    <div class="tit-2 tit-skin-2 fn-mb20">
                        <span class="h">取消订单记录</span>
                    </div>

                    <div class="bl-nodata order-nodata">
                        <div class="nodata-text fn-dib">
                            <i class="icon icon-nodata icon-nodata-1"></i>
                            <p class="fn-mb0">您暂时没有取消订单。</p>
                            <a href="/my/order">查看全部订单 &gt;</a>
                        </div>
                    </div>
                </div>
                @endif
                <!--END/无数据-->

            </div>

            <!--订单和收藏-->

            <!--END/订单和收藏-->

        </div>
        <!--END/主体部分-->

    </div>
</div>

<!--物流 模板-->

<!--END/物流 模板-->

<!--公共尾部-->
@include('front.common.footer')

<!--END/公共尾部-->

<!--公用js引用-->
@include('front.common.script')

<!--END/公用js引用-->

<!--<script src="../js/home.js"></script>-->
</body>
</html>